<!--工厂信息-->
<template>
  <div>
    <div>
      <el-form :model="form" ref="queryForm" v-show="showSearch" :inline="true">
        <el-form-item label="工厂名称" prop="roleName">
          <el-input v-model="form.name" placeholder="请输入工厂名称" clearable size="small" style="width: 240px" @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item>
          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button type="primary" icon="el-icon-plus" @click="newFactory">新增</el-button>
        </el-col>
        <right-toolbar :showSearch.sync="showSearch" @queryTable="reGetList"></right-toolbar>
      </el-row>
      <el-table :data="tableData" border style="width: 100%" stripe>
        <el-table-column prop="id" label="厂房编号" width="80px"></el-table-column>
        <el-table-column prop="name" label="工厂名称"></el-table-column>
        <el-table-column prop="type" label="工厂类型"></el-table-column>
        <el-table-column prop="legalPersonMessage" label="法人信息"></el-table-column>
        <el-table-column prop="legalPersonTel" label="法人电话"></el-table-column>
        <el-table-column prop="address" label="工厂地址"></el-table-column>
        <el-table-column label="操作" width="145px">
          <template slot-scope="scope">
            <el-button type="primary" icon="el-icon-edit" @click="handleEdit(scope.$index,scope.row)"></el-button>
            <el-button type="primary" icon="el-icon-delete" slot="reference" @click="del(scope.$index,scope.row)"></el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @current-change="handleCurrentChange"
        :current-page=queryParams.pageNum
        :page-size=queryParams.pageSize
        layout="total, prev, pager, next, jumper"
        :total=total>
      </el-pagination>
    </div>
    <div>
      <!--编辑工厂信息-->
      <el-dialog :visible.sync="dialogVisible1" width="30%">
        <el-form label-width="120px">
          <el-form-item :model="newTableData" label="工厂名称">
            <el-input style="width: 80%" v-model="newTableData.name" clearable></el-input>
          </el-form-item>
          <el-form-item :model="newTableData" label="工厂类型">
            <el-input style="width: 80%" v-model="newTableData.type" clearable></el-input>
          </el-form-item>
          <el-form-item label="法人信息">
            <el-input style="width: 80%" v-model="newTableData.legalPersonMessage" clearable></el-input>
          </el-form-item>
          <el-form-item label="法人电话">
            <el-input style="width: 80%" v-model="newTableData.legalPersonTel" clearable></el-input>
          </el-form-item>
          <el-form-item label="工厂地址">
            <el-input style="width: 80%" v-model="newTableData.address" clearable></el-input>
          </el-form-item>
        </el-form>
        <span class="dialog-footer">
      <el-button @click="cancel">取消</el-button>
      <el-button type="primary" @click="saveEdit()">提交</el-button>
    </span>
      </el-dialog>
    </div>
    <div>
      <!--新增工厂-->
      <el-dialog :visible.sync="dialogVisible2" width="30%">
        <el-form label-width="120px">
          <el-form-item :model="newTableData" label="工厂名称">
            <el-input style="width: 80%" v-model="newTableData.name" clearable></el-input>
          </el-form-item>
          <el-form-item :model="newTableData" label="工厂类型">
            <el-input style="width: 80%" v-model="newTableData.type" clearable></el-input>
          </el-form-item>
          <el-form-item label="法人信息">
            <el-input style="width: 80%" v-model="newTableData.legalPersonMessage" clearable></el-input>
          </el-form-item>
          <el-form-item label="法人电话">
            <el-input style="width: 80%" v-model="newTableData.legalPersonTel" clearable></el-input>
          </el-form-item>
          <el-form-item label="工厂地址">
            <el-input style="width: 80%" v-model="newTableData.address" clearable></el-input>
          </el-form-item>
        </el-form>
        <span class="dialog-footer">
                  <el-button @click="cancel">取消</el-button>
                  <el-button type="primary" @click="saveNewList()">提交</el-button>
                </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import {addList, getListByName,delList, editList, listFactory} from "@/api/product/factory";
import {listAnimals} from "@/api/animals/animals";

export default {
  data(){
    return{
      total: 0,
      form:{
        name:''
      },
      queryParams: {
        pageNum: 1,
        pageSize: 10
      },
      dialogVisible1 : false,
      dialogVisible2 : false,
      tableData: [{
        id:0,
        name:'',
        type:'',
        legalPersonMessage:'',
        legalPersonTel:'',
        address:''
      }],
      newTableData:{
        id:0,
        name:'',
        type:'',
        legalPersonMessage:'',
        legalPersonTel:'',
        address:''
      },
      showSearch:true
    }
  },created:function () {
    this.getList()
  },methods:{
    getList() {
      listFactory(this.queryParams).then(res => {
          this.tableData = res.data;
          this.total = parseInt(res.msg);
        }
      );
    },reGetList() {
      this.queryParams.pageNum=1
      this.getList()
    },handleCurrentChange(val){
      this.queryParams.pageNum = val;
      this.getList()
    },resetQuery(){
      this.form={}
      this.reGetList()
    },handleQuery(){
      this.queryParams.pageNum=1
      getListByName({'name':this.form.name}).then(res=>{
        if(res.data!=null){
          this.tableData=res.data
          this.total=parseInt(res.msg)
        }else{
          this.$message('查无此人')
        }
      })
    },
    //打开编辑弹窗
    handleEdit(index,row){
      this.dialogVisible1 = true
      this.newTableData={}
      this.newTableData=JSON.parse(JSON.stringify(row))
    }, saveEdit(){
      this.dialogVisible1 = false
      editList(this.newTableData).then(res=>{
        if(res.data==true){
          this.queryParams.pageNum=1
          this.getList()
          this.$message('编辑成功')
        }else{
          this.$message('修改失败请重新再试')
        }
      })
      //此处提交
    },del(index,row){
      delList({'id':parseInt(row.id)}).then(res=>{
        if(res.data==true){
          this.$message('删除成功')
          this.queryParams.pageNum=1
          this.getList()
        }else{
          this.$message('删除失败，请重新再试')
        }
      })
    },newFactory(){
      this.dialogVisible2 = true
      this.newTableData={}
    },saveNewList(){
      addList(this.newTableData).then(res=>{
        if(res.data==true){
          this.dialogVisible2 = false
          this.queryParams.pageNum=1
          this.getList()
          this.$message('添加成功')
        }else{
          this.$message('添加失败，请重新再试')
        }
      })

    },cancel(){
      this.dialogVisible1 = false
      this.dialogVisible2 = false
    },
  }
}
</script>

<style>

</style>
